<template>
	<div class="good bfff">
		<div class="space-between mb30">
			<div class="f26">{{v.createTime}}</div>
			<div class="f26 t-red">{{getstate(v.state)}}</div>
			<!-- <div class="f26">待发货</div> -->
			<!-- <div class="f26">订单取消,<span class="t-red">积分已退回</span></div> -->
			<!-- <div class="f26">已发货</div> -->
			<!-- <div class="f26">已完成</div> -->
		</div>
		<div class="center box1 mb48" v-for="item in v.goodsList" @click="goDetail(v.orderNo)">
			<image :src="item.goodsImg" mode="aspectFill" class="goods-cover"></image>
			<div class="ml28 flex1">
				<div class="f30 line2 mb40">{{item.goodsName}}</div>
				<div class="space-between">
					<div class="f26 c999">{{item.specs}}</div>
					<div class="f20"><span class="f32 fbold mr12">{{item.amount}}</span>积分</div>
				</div>
			</div>
			<div></div>
		</div>
		<btns :v="v" @reset="reset"></btns>
		<div class="express flex-start mt30" v-if="v.state==1">
			<image src="@/static/mall/wuliu.png" mode="widthFix" class="car-icon"></image>
			<div class="ml16 f26 flex1">兑换成功后48小时内发货</div>
		</div>
	</div>
</template>

<script>
	// 0 待付款 1 待发货 2 已发货（待签收） 5 退款/售后 3-已签收 6 已取消 7 交易完成
	import btns from './btns'
	export default {
		data() {
			return {

			}
		},
		props: {
			v: Object
		},
		components: {
			btns
		},
		methods: {
			// 获取状态
			getstate(s) {
				if (s == 1) {
					return '待发货'
				} else if (s == 2) {
					return '已发货'
				} else if (s == 3) {
					return '已收货'
				} else if (s == 4) {
					return '退款'
				} else if (s == 5) {
					return '售后'
				} else if (s == 6) {
					return '已取消'
				} else if (s == 7) {
					return '交易完成'
				} else if (s == 0) {
					return '待支付'
				} else {
					return '其他'
				}

			},
			reset() {
				this.$emit('reset')
			},
			goDetail(v) {
				uni.navigateTo({
					url: '/pages/dingDan/shangChengXiangXi?orderId=' + v
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.good {
		margin: 0 32rpx 30rpx;
		width: 686rpx;
		border-radius: 12rpx;
		box-shadow: 0rpx 0rpx 30rpx rgba(230, 230, 230, 1);
		padding: 32rpx 28rpx;

		.t-red {
			color: rgba(255, 85, 85, 1);
		}

		.box1 {
			.goods-cover {
				width: 190rpx;
				height: 190rpx;
				border-radius: 12rpx;
			}

			.line2 {
				line-height: 44rpx;
			}

			.t-red {
				color: rgba(255, 85, 85, 1);
			}
		}

		.notes {
			width: 686rpx;
			padding: 26rpx 28rpx;
			border-radius: 12rpx;
			box-shadow: 0rpx 0rpx 30rpx rgba(230, 230, 230, 1);
			color: rgba(104, 104, 104, 1);

			.f30 {
				width: 90rpx;
			}
		}




		.express {
			width: 630rpx;
			// height: 52rpx;
			background: rgba(255, 242, 245, 1);
			padding: 18rpx;

			.car-icon {
				width: 40rpx;
				height: 29rpx;
			}

			.flex1 {
				line-height: 36rpx;
			}
		}
	}
</style>